<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <title></title>
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/common.js"></script>
    <script src="js/mui.min.js"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link href="css/style.css" rel="stylesheet"/>
</head>
<body>
    <div class="container">
        <header class="mui-bar mui-bar-nav layout-bg">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left l-arrow"></a>
            <h1 class="mui-title">系统设置</h1>
        </header>

        <div class="per-list-box layout-gap">
            <ul class="mui-table-view per-box">
                <li class="mui-table-view-cell">
                    <a class="personal-data">
                        <span class="per-list-icon my-icon fl"></span>
                        <div class="fl">
                            <div class="mui-navigate-right per-item">个人资料</div>
                        </div>
                    </a>
                </li>
                <li class="mui-table-view-cell">
                    <a class="edit-password">
                        <span class="per-list-icon password-icon fl"></span>
                        <div class="fl">
                            <div class="mui-navigate-right per-item">修改密码</div>
                        </div>
                    </a>
                </li>
                <li class="mui-table-view-cell">
                    <a>
                        <span class="per-list-icon sym-setting-icon fl"></span>
                        <div class="fl">
                            <div class="per-item">清除缓存</div>
                        </div>

                        <div class="fr cache-num">0.2M</div>
                    </a>
                </li>
            </ul>

            <div class="exit-login">退出登录</div>
        </div>
    </div>
    
    <script type="text/javascript">
    	$(function() {
    		mui('.mui-table-view').on('tap', '.personal-data', ()=> {
	    		mui.openWindow({
					url: 'personal-data.html',
					id: 'personal-data.html'
				});
	    	});
	    	
	    	mui('.mui-table-view').on('tap', '.edit-password', ()=> {
	    		mui.openWindow({
					url: 'edit-password.html',
					id: 'edit-password.html'
				});
	    	});
	    	
	    	$('.exit-login').on('click', ()=> {
	    		
	    		mui.openWindow({
	    			url: 'login.html',
	    			id: 'login.html'
	    		})
	    	})
    	})
    </script>
</body>
</html>